import { useEffect, useMemo, useState } from 'react';
import { Button, Spin, Tabs, message, Badge } from 'antd';
import { ReloadOutlined } from '@ant-design/icons';
import { ContractWarnTabsPane } from './ContractWarnTabsPane';
import Cls from 'classnames';
import InfiniteScroll from 'react-infinite-scroller';
import '../common/styles.less';
import pageStyles from '@/common/pageLayout.less';
import { contractWarnService, getContractWarnDataSercvice } from '../services';

export const ContractWarnView: React.FC<ContractWarnsAPI.IContractWarnView> = ({ curRes }) => {
  /** 样式根目录 */
  const styleFixCls = 'contract-warn';

  /** 存入选中的tab标识 */
  const [tabPaneKey, setTabPaneKey] = useState<string>('1');

  /** 保存合同预警数据 */
  const [manageDataList, setManageDataList] = useState<Record<string, any>[]>([]);

  const [isOnReload, setIsOnReload] = useState<boolean>(false);

  /**
   * 保存的分页参数
   */
  const [scrollObj, setScrollObj] = useState<any>({
    total: 0,
    count: 0,
    loading: false,
    hasMore: true,
    limit: 10,
  });

  /** 回调 */
  // const homeCallback = (res: any) => {
  //   if (res && res?.msgFlag) {
  //     setManageDataList(res?.rows);
  //   } else {
  //     message.error(res?.msg);
  //   }
  // };

  /** 获取数据 */
  // const { loading, reloadRefresh, getContractData } = contractWarnService(curRes, homeCallback);

  const getContractWarnDataCallback = (res: any) => {
    if (!(res && res?.msgFlag)) {
      message.error(res?.msg);
    } else {
      setManageDataList(res?.rows);
      setScrollObj({
        ...scrollObj,
        loading: false,
        total: res.total,
      });
    }
    setIsOnReload(false);
  };
  /**
   * 引入获取预警接口
   */
  const { getContractWarnDataRun, getContractWarnDataLoading } = getContractWarnDataSercvice(curRes, getContractWarnDataCallback);

  /**
   * 初始化获取数据
   */
  const defaultGetWarnData = () => {
    let { count, limit } = scrollObj;
    count++;
    setScrollObj({
      ...scrollObj,

      count: count,
      loading: true,
    });
    let payload = {
      page: 1,
      rows: count * 10 + limit,
    };
    getContractWarnDataRun(payload);
  };

  useEffect(() => {
    defaultGetWarnData();
  }, []);

  /**
   * 处理滚动加载
   */
  const handleInfiniteOnLoad = () => {
    const { total } = scrollObj;
    if (manageDataList?.length >= total) {
      message.warning('没有更多数据了哦');
      setScrollObj({
        ...scrollObj,
        hasMore: false,
        loading: false,
      });
      return;
    }
    defaultGetWarnData();
  };

  /** 返回子组件 */
  const renderTabsPane = () => {
    if (tabPaneKey == '1') {
      return (
        <ContractWarnTabsPane
          styleClassName={styleFixCls}
          contractInfoList={manageDataList}
          // reloadManage={reloadRefresh}
          reloadManage={() => {
            defaultGetWarnData();
          }}
          curRes={curRes}
        />
      );
    }
  };

  /** 刷新回调 */
  const reloadHomeCallback = () => {
    // reloadRefresh();
    setScrollObj({
      ...scrollObj,
      count: 0,
    });
    setIsOnReload(true);
  };

  useEffect(() => {
    if (scrollObj?.count == 0 && isOnReload) {
      defaultGetWarnData();
    }
  }, [scrollObj?.count, isOnReload]);

  /** 刷新 */
  const tabsExtraBtns = () => {
    return <Button type="primary" icon={<ReloadOutlined />} onClick={reloadHomeCallback} />;
  };

  /** tabs子页面 */
  const tabsItem = useMemo(() => {
    let items: any[] = [
      {
        label: '提醒事项',
        key: '1',
        children: renderTabsPane,
        isShow: curRes['/warnController/contractHomePage'] || false,
      },
    ];

    const newItems: any[] = items?.filter((item: any) => item?.isShow);
    return newItems;
  }, [manageDataList, tabPaneKey, curRes]);

  return (
    <div className={Cls(`${styleFixCls}`, pageStyles['commonTabsLine'])}>
      {/* <Tabs
        activeKey={tabPaneKey}
        tabBarExtraContent={tabsExtraBtns()}
        items={tabsItem}
        onChange={(activeKey: string) => {
          setTabPaneKey(activeKey);
        }}
      ></Tabs> */}

      <Spin spinning={getContractWarnDataLoading}>
        {/* <Tabs
          activeKey={tabPaneKey}
          tabBarExtraContent={tabsExtraBtns()}
          // items={tabsItem}
          onChange={(activeKey: string) => {
            setTabPaneKey(activeKey);
          }}
        >
          <Tabs.TabPane tab="提醒事项" key={'1'}>
            <div className={pageStyles['InfiniteScrollView']}>
              <InfiniteScroll
                loadMore={handleInfiniteOnLoad}
                initialLoad={false}
                pageStart={1}
                useWindow={false}
                hasMore={!scrollObj?.loading && scrollObj?.hasMore}
              >
                <ContractWarnTabsPane
                  styleClassName={styleFixCls}
                  contractInfoList={manageDataList}
                  // reloadManage={reloadRefresh}
                  reloadManage={() => {
                    defaultGetWarnData();
                  }}
                  curRes={curRes}
                />
              </InfiniteScroll>
            </div>
          </Tabs.TabPane>
        </Tabs> */}
      </Spin>
    </div>
  );
};
